<%@ page language="java" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<!-- Standard Meta -->
<c:import url="../common/meda.jsp"></c:import>

<!-- Site Properties -->
<title>院校库-${sysDesc}</title>
<link rel="stylesheet" type="text/css" href="/css/semantic.css">
<link rel="stylesheet" type="text/css" href="/css/common.css">

<script src="/js/jquery.min.js"></script>
<script src="/js/semantic.js"></script>
<script src="/js/common.js"></script>
<script src="//${static_server }/js/title_menu.js"></script>
<script>
	$(document).ready(function() {
		var tab = $('#schoolbodysegment .ui.stackable.pointing.teal.secondary.menu .item').tab({
			cache : false,
			apiSettings : {
				loadingDuration : 300,
				url : '/college/index_{tab}.html',
				dataType : 'html',

			},
			context : 'parent',
			onVisible : function(tabPath) {
				$('.image img').visibility({
					type : 'image',
					transition : 'fade in',
					duration : 500
				});
			},
		});
	});
</script>
</head>
<body class="pushable">
	<c:import url="../common/title_menu.jsp"></c:import>
	<div class="pusher">
		<div id="schoolheadsegment"
			class="ui vertical raised masthead segment">
			<div class="ui container">
				<div class="ui breadcrumb">
					<a class="section" href="http://${static_server }/"><i
						class="icon home"></i>首页</a>
					<div class="divider">/</div>
					<div class="active section">院校库</div>
				</div>
			</div>
			<!-- content container end -->
		</div>
		<div id="schoolbodysegment" class="ui vertical basic masthead segment">
			<div class="ui container" style="min-height: 192px; padding-top:15px;">
				<div class="ui stackable pointing teal secondary menu">
					<c:forEach var="item" items="${charMap}" varStatus="status">
						<a class='<c:if test="${status.index == 0 }">active</c:if> item'
							data-tab="${item.key}"><div
								class="floating ui orange circular label">${item.value}</div>${item.key}</a>
					</c:forEach>
				</div>
				<c:forEach var="item" items="${charMap}" varStatus="status">
					<div
						class='<c:if test="${status.index == 0 }">active</c:if> ui raised tab segment '
						data-tab="${item.key}">
						<div class="ui four column relaxed grid">
							<c:if test="${item.key eq 'A' }">
								<c:forEach var="college" items="${colleges}">
									<div class="column">
										<div class="ui large items">
											<div class="item">
												<div class="ui mini image">
													<img
														data-src="/images/${college.college_id }/headImage.jpg"
														src="/images/default-image.png">
												</div>
												<div class="middle aligned content">
													<a href="/college/${college.college_id }/base.html" target="_blank">${college.college_name }</a>
												</div>
											</div>
										</div>
									</div>
								</c:forEach>
							</c:if>
						</div>
					</div>
				</c:forEach>
			</div>
			<!-- content container end -->
		</div>
		<c:import url="../common/footer.jsp"></c:import>
	</div>
	<!-- pusher end -->
</body>
</html>
